import { useLocation } from 'react-router-dom'
import { Tabs } from 'antd'
// react的一个url参数插件, https://blog.csdn.net/qq_36448844/article/details/98201496
import URL from 'url'
const { TabPane } = Tabs
const Foo = () => {
	// URL
	const param: any = URL.parse(window.location.href, true).query
	console.log('URL解析出的param => ', param)
	// useLocation
	let { state: data }: any = useLocation()
	const list = data.params
	console.log('useLocation():state => ', data)
	return (
		<div style={{ backgroundColor: 'white' }}>
			<Tabs defaultActiveKey="1" centered type="card">
				{list.map((item: any, index: number) => (
					<TabPane tab={item.tabName} key={index}>
						<iframe
							src={item.url}
							title={item.title}
							style={{
								width: '100%',
								minHeight: 'calc(100vh - 150px)',
								border: 'none',
							}}
						></iframe>
					</TabPane>
				))}
			</Tabs>
		</div>
	)
}
export default Foo
